<template>
	<view style="overflow: auto;">
		<!-- 侧边设置 -->
		<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
			<view class="cu-dialog basis-lg" @tap.stop="" :style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
				<view class="cu-list menu text-left">
					<view class="cu-item">
						<view class="content">
							<view>设置</view>
						</view>
					</view>
					<scroll-view scroll-y style="height: calc( 100vh - 58px);">
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.ycDy" :key="index">
										<jiuaiCheckbox @change='ycDyChange' :value="item.state" :checked="item.state" :index="index" :ref='"ycDy"+index'></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
							<view class="cu-item">
								<view class="content">
									<button @tap="ycDy()">远程打印</button>
								</view>
							</view>
						</view>
					
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.xpDy" :key="index">
										<jiuaiCheckbox @change='xpDyChange' :value="item.state" :checked="item.state" :index="index" :ref='"xpDy"+index'></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
							<view class="cu-item">
								<view class="content">
									<button @tap="xpDy()">小票打印</button>
								</view>
							</view>
						</view>
						
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.djSh" :key="index">
										<jiuaiCheckbox @change='djShChange' :value="item.state" :checked="item.state" :index="index" :ref='"djSh"+index'></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
							<view class="cu-item">
								<view class="content">
									<button @tap="djSh">单据审核</button>
								</view>
							</view>
						</view>
						
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.onlyAddNum" :key="index">
										<jiuaiCheckbox @change='onlyAddNumChange' :value="item.state" :checked="item.state" :index="index"></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.BarcodeRule" :key="index">
										<jiuaiCheckbox @change='BarcodeChange' :value="item.state" :checked="item.state" :index="index"></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.GoodShowSimpleInfo" :key="index">
										<jiuaiCheckbox @change='GoodShowSimpleInfoChange' :value="item.state" :checked="item.state" :index="index"></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.QuiteAddGoodInfo" :key="index">
										<jiuaiCheckbox @change='QuiteAddGoodInfoChange' :value="item.state" :checked="item.state" :index="index"></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
						<view class="cu-list-item">
							<view class="cu-item">
								条码查询模式(模糊)
							</view>
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.BarLike" :key="index">
										<jiuaiCheckbox @change='BarLikeCode' :value="item.state" :checked="item.state" :index="index" :ref='"BarLike"+index'></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
						<!-- <view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<button @tap="changeSelectShow">样式切换</button>
								</view>
							</view>
						</view> -->
						<view class="cu-list-item">
							<view class="cu-item">
								<view class="content">
									<view class="content_item" v-for="(item,index) in cgSettingLocations.isMoreSelectGood" :key="index">
										<jiuaiCheckbox @change='isMoreSelectGoodChange' :value="item.state" :checked="item.state" :index="index"></jiuaiCheckbox>
										<text>{{item.title}}</text>
									</view>
								</view>
							</view>
						</view>
										
					</scroll-view>
					
				</view>
			</view>
		</view>
		<!-- 打印份数 -->
		<view class="cu-modal printset" :class="modalPrintName=='printSetting'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">打印设置</view>
					<!-- 	<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red"></text>
					</view> -->
				</view>
				<view class="padding-xl">
					<view class="printNum">
						<text>打印份数:</text>
						<input class="inpt1" placeholder="打印份数" :value="printNum" @input="getPrintNum" />
					</view>
					<view class="uni-list">
						<view class="uni-list-title">打印机编号</view>
						<radio-group @change="radioChange" class="radioWrap">
							<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in 25" :key="item">
								<view>
									<radio :value="item+''" :checked="index === current" />
								</view>
								<view>{{item}}</view>
							</label>
						</radio-group>
					</view>
				</view>
				<view class="padding-bt">
					<view @tap="PrintOrder()">确定</view>
					<view @tap="cancelModel()">取消</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import jiuaiCheckbox from "@/components/jiuai-checkbox.vue";
	export default {
		data() {
			return {
				cgSettingLocations: {},
				printNum: 0,
				printCode: 0,
				current: -1,
				CustomBar: this.CustomBar,
				modalPrintName: this.modalNames,
				defaultSetting: {
					isChange: 1,
					// 远程打印
					ycDy: [{
						title: "保存后询问",
						state: false
					}, {
						title: "直接打印",
						state: false
					}],
					xpDy: [{
						title: "保存后询问",
						state: false
					}, {
						title: "直接打印",
						state: false
					}],
					// 单据审核
					djSh: [{
						title: "保存后询问",
						state: false
					}, {
						title: "直接审核",
						state: false
					}],
					// 重复扫描时只累计数量
					onlyAddNum: [{
						title: "重复扫描时只累计数量",
						state: false
					}],
					// 条码规则
					BarcodeRule: [{
						title: "条码规则",
						state: false
					}],
					// 条码规则
					GoodShowSimpleInfo: [{
						title: "商品只显示基本信息",
						state: false
					}],
					// 条码规则
					QuiteAddGoodInfo: [{
						title: "开启快速扫描",
						state: false
					}],
					//条码模糊规则
					BarLike: [{
						title: "左",
						state: false
					}, {
						title: "右",
						state: false
					}, {
						title: "全",
						state: false
					}],
					// 条码规则
					isMoreSelectGood: [{
						title: "是否多选商品",
						state: false
					}]
				}
				// modalName:this.modalName
			}
		},
		created() {
			let setting = uni.getStorageSync(this.settingObj, "");
			console.log(this.settingObj);
			console.log(setting);
			if (setting === "") {
				this.cgSettingLocations = this.defaultSetting;
			} else {
				let cgSettingLocations = JSON.parse(setting);
				if (cgSettingLocations.isChange != this.defaultSetting.isChange) {
					this.cgSettingLocations = this.defaultSetting;
				} else {
					this.cgSettingLocations = cgSettingLocations;
				}
			}
			this.$emit("changeSetting", {
				detail: this.cgSettingLocations
			})
			// console.log(this.cgSettingLocation=="");
			// if(this.cgSettingLocation==""){
			// 	this.cgSettingLocations = this.defaultSetting;
			// }else{
			// 	this.cgSettingLocations = this.cgSettingLocation;
			// }
			// this.cgSettingLocations = this.cgSettingLocation;
		},
		components: {
			jiuaiCheckbox
		},
		props: {
			//保存的本地单据内设置标识
			settingObj: {
				type: String,
				default: ""
			},
			modalName: {
				type: String,
				default: ""
			},
			modalNames: {
				type: String,
				default: ""
			},
			BillType: {
				type: [String, Number],
				default: 1
			}
		},
		methods: {
			changeSelectShow() {
				this.$emit("changeSelectShow");
			},
			//获取输入的打印数
			getPrintNum(e) {
				this.$emit("getPrintNum", {
					detail: {
						value: e.detail.value
					}
				})
				// console.log();
			},
			PrintOrder(type = "") {
				this.modalPrintName = null;
				this.$emit("PrintOrder")
			},
			//远程打印单选框改变事件
			ycDyChange(e) {
				this.cgSettingLocations.ycDy[e.detail.index].state = !this.cgSettingLocations.ycDy[e.detail.index].state;
				var that = this;
				this.cgSettingLocations.ycDy.forEach((item, index) => {
					console.log(item);
					if (index != e.detail.index) {
						this.cgSettingLocations.ycDy[index].state = false;
						that.$refs[`ycDy${index}`][0].dataChecked = false;
					}
				});
				this.settingNow();
			},
			//小票打印单选框改变事件
			xpDyChange(e) {
				this.cgSettingLocations.xpDy[e.detail.index].state = !this.cgSettingLocations.xpDy[e.detail.index].state;
				var that = this;
				this.cgSettingLocations.xpDy.forEach((item, index) => {
					console.log(item);
					if (index != e.detail.index) {
						this.cgSettingLocations.xpDy[index].state = false;
						that.$refs[`xpDy${index}`][0].dataChecked = false;
					}
				});
				this.settingNow();
			},
			hideModal() {
				this.$emit("hideModal");
				// this.modalName = null;
			},
			//审核单选框改变事件
			djShChange(e) {
				// console.log()
				this.cgSettingLocations.djSh[e.detail.index].state = !this.cgSettingLocations.djSh[e.detail.index].state;
				var that = this;
				// console.log(e.detail.index);
				this.cgSettingLocations.djSh.forEach((item, index) => {
					// console.log(`djSh{index}`);
					if (index != e.detail.index) {
						this.cgSettingLocations.djSh[index].state = false;
						that.$refs[`djSh${index}`][0].dataChecked = false;
					}
				});
				// console.log(this.cgSettingLocation);
				this.settingNow();
				// this.cgSettingLocation.djSh[e.detail.index].state = e.detail.checked;
				// this.settingNow();
			},
			BarLikeCode(e) {
				this.cgSettingLocations.BarLike[e.detail.index].state = !this.cgSettingLocations.BarLike[e.detail.index].state;
				var that = this;
				// console.log(e.detail.index);
				this.cgSettingLocations.BarLike.forEach((item, index) => {
					// console.log(`djSh{index}`);
					if (index != e.detail.index) {
						this.cgSettingLocations.BarLike[index].state = false;
						that.$refs[`BarLike${index}`][0].dataChecked = false;
					}
				});
				// console.log(this.cgSettingLocation);
				this.settingNow();
			},
			//保存当前的设置
			settingNow() {
				console.log(this.settingObj);
				uni.setStorageSync(this.settingObj, JSON.stringify(this.cgSettingLocations));
				console.log(this.settingObj);
				console.log(this.cgSettingLocations);
				this.$emit("changeSetting", {
					detail: this.cgSettingLocations
				})
			},
			radioChange(e) {
				this.$emit("radioChange", {
					detail: {
						value: e.detail.value
					}
				})
				// this.printCode = 
			},
			//远程打印
			ycDy() {

				this.$emit("ycDy");
				// if (this.isChange) {
				// 	this.modalNames = "printSetting";
				// } else {
				// 	Api.showTip("请先查询单据");
				// }
			},
			//小票打印
			xpDy() {
				// console.log("小票打印")
				this.$emit("xpDy");
				// if (this.isChange) {
				// 	this.modalNames = "printSetting";
				// } else {
				// 	Api.showTip("请先查询单据");
				// }
			},
			//单据审核
			djSh() {
				this.$emit("djSh");
				// if (this.isChange) {
				// 	this.isBillCheck();
				// } else {
				// 	Api.showTip("请先查询单据");
				// }
			},
			cancelModel() {
				this.modalPrintName = null;
			},
			//重复扫描只累计数量单选框改变事件
			onlyAddNumChange(e) {
				this.cgSettingLocations.onlyAddNum[e.detail.index].state = !this.cgSettingLocations.onlyAddNum[e.detail.index].state;
				this.settingNow();
			},
			//条码规则单选框改变事件
			BarcodeChange(e) {
				this.cgSettingLocations.BarcodeRule[e.detail.index].state = !this.cgSettingLocations.BarcodeRule[e.detail.index].state;
				this.settingNow();
			},
			//商品简略信息设置
			GoodShowSimpleInfoChange(e) {
				this.cgSettingLocations.GoodShowSimpleInfo[e.detail.index].state = !this.cgSettingLocations.GoodShowSimpleInfo[e.detail
					.index].state;
				this.settingNow();
			},
			//商品简略信息设置
			QuiteAddGoodInfoChange(e) {
				this.cgSettingLocations.QuiteAddGoodInfo[e.detail.index].state = !this.cgSettingLocations.QuiteAddGoodInfo[e.detail
					.index].state;
				this.settingNow();
			},
			//条码规则单选框改变事件
			isMoreSelectGoodChange(e) {
				console.log(this.cgSettingLocations.isMoreSelectGood[e.detail.index].state);
				this.cgSettingLocations.isMoreSelectGood[e.detail.index].state = !this.cgSettingLocations.isMoreSelectGood[e.detail
					.index].state;
				this.settingNow();
			}
		}
	}
</script>

<style>
	/* 打印机设置 */
	.printset .cu-dialog {
		min-height: 400px;
		max-height: 400px;
		overflow: auto;

	}

	.printset .cu-dialog .cu-bar {
		max-height: 40px;
		min-height: 40px;
	}

	.printset .cu-dialog .padding-bt {
		height: 40px;
		line-height: 40px;
		display: flex;
	}

	.printset .cu-dialog .padding-xl {
		max-height: 320px;
		min-height: 320px;
		overflow: auto;
		padding: 0px;
	}

	.printset .cu-dialog .padding-xl .printNum {
		min-height: 40px;
		max-height: 40px;
		text-align: left;
		padding-left: 8px;
		padding-right: 8px;
		box-sizing: border-box;
		border-bottom: 1px dashed #CCC;
		display: flex;
		padding-top: 5px;
	}

	.printset .cu-dialog .padding-xl .printNum text {
		display: block;
		height: 30px;
		line-height: 30px;
		font-size: 14px;
	}

	.printset .cu-dialog .padding-xl .printNum input {
		border: 1px solid #CCC;
		height: 30px;
		line-height: 30px;
		padding-left: 8px;
		flex: 1;
		margin-left: 8px;
	}

	.printset .cu-dialog .padding-bt view {
		flex: 1;
		border-top: 1px solid #CCC;
	}

	.printset .cu-dialog .uni-list {
		min-height: 280px;
		max-height: 280px;
	}

	.printset .cu-dialog .uni-list .uni-list-title {
		height: 40px;
		line-height: 40px;
		text-align: left;
		padding-left: 10px;
		box-sizing: border-box;
		border-bottom: 1px solid #CCC;
	}

	.printset .cu-dialog .uni-list .radioWrap {
		min-height: 240px;
		max-height: 240px;
		overflow: auto;
		width: 100%;
		padding-left: 8px;
		padding-right: 8px;
		box-sizing: border-box;
	}

	.printset .cu-dialog .uni-list .radioWrap label {
		display: flex;
		line-height: 35px;
		border-bottom: 1px dashed #CCC;
	}

	.printset .cu-dialog .uni-list .radioWrap label radio {
		margin-right: 10px;

	}

	.cu-list-item {
		width: 100%;
		padding-top: 10px;
		/* padding-bottom: 10px; */
		padding-left: 8px;
		border-bottom: 1px dashed #CCC;
	}

	.cu-item {
		margin-bottom: 10px;
	}

	.cu-item .content {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 12px;
		text-align: left;
		margin-left: 1px !important;
	}

	.cu-item .content .content_item {
		flex: 1;
		display: flex;
		justify-content: left;
		align-items: center;
	}

	.cu-item .content text {
		padding-left: 3px;
	}

	.cu-item .content button {
		width: 95%;
		height: 30px;
		line-height: 30px;
		background: rgba(124, 170, 216, 1);
		color: #FFF;
		font-size: 12px;
		margin-left: 1px !important;
	}
</style>
